<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/user-login.css"
          type="text/css" media="all">
    <script src="${pageContext.request.contextPath}/static/js/jquery-1.11.0.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/js/user-login.js"></script>
    <script>
        $(function () {
            //登录
            $("#loginForm").submit(function () {
                $.ajax({url:"${pageContext.request.contextPath}/user/login",
                    type :"post",
                    data:$("#loginForm").serialize(),
                    dataType:"json",
                    success:function (data) {
                        if (data.flag){
                            location.href="${pageContext.request.contextPath}/index.jsp";
                        }else{
                            //alert("111")
                            $("#loginmsg").html(data.errorMsg);
                        }

                    },
                    error:function (data) {
                        //alert(3);
                        $("#loginmsg").html(data.errorMsg);
                    },
                });
                return false;
            });


            //找回密码
            $("#findPassword").submit(function () {
                $.ajax({url:"${pageContext.request.contextPath}/user/findPassword",
                    type :"post",
                    data:$("#findPassword").serialize(),
                    dataType:"json",
                    success:function (data) {
                        if (data.flag){
                            //location.href="${pageContext.request.contextPath}/index.jsp";
                            $("#passwordmsg").html(data.errorMsg);
                        }else{
                            //alert("111")
                            $("#passwordmsg").html(data.errorMsg);
                        }

                    },
                    error:function (data) {
                        //alert(3);
                        $("#passwordmsg").html(data.errorMsg);
                    },
                });
                return false;
            });
        });
    </script>
</head>
<body>
<div class="dowebok ${requestScope.login ? "" : "right-panel-active"}" id="dowebok">
    <div class="form-container sign-up-container">
        <form id="findPassword" action="${pageContext.request.contextPath}/user/findPassword" method="post">
            <h1>找回密码</h1>
            <div class="social-container">
            </div>
            <input type="text" name="username" id="username" placeholder="账号">

            <input type="email" name="email" id="email" placeholder="电子邮箱">

            <button>找回密码</button>
            <span id="passwordmsg" style="color: red;"></span>
        </form>
    </div>
    <div class="form-container sign-in-container">
        <form id="loginForm" method="post" action="${pageContext.request.contextPath}/user/toLogin">
            <h1>登录</h1>
            <div class="social-container">
            </div>
            <input type="text" name="username" placeholder="账号">
            <input type="password" name="password" placeholder="密码">
            <tr>

                <td class="td_right check">
                    <input type="text" id="check" name="check" class="check" placeholder="验证码">
                    <img src="checkCode" height="32px" alt="" onclick="changeCheckCode(this)">
                    <script type="text/javascript">
                        //图片点击事件
                        function changeCheckCode(img) {
                            img.src="checkCode?"+new Date().getTime();
                        }
                    </script>
                </td>
            </tr>
            <a href="${pageContext.request.contextPath}/user/toRegister">没有账号，去注册！</a>
            <button>登录</button>
            <span id="loginmsg" style="color: red;"></span>
        </form>
    </div>
    <div class="overlay-container">
        <div class="overlay">
            <div class="overlay-panel overlay-left">
                <h1>已找回密码？</h1>
                <p>请使用您的帐号密码进行登录</p>
                <button class="ghost" id="signIn">登录</button>
            </div>
            <div class="overlay-panel overlay-right">
                <h1>没有密码？</h1>
                <p>立即找回密码，和我们一起开始旅程吧</p>
                <button class="ghost" id="signUp">找回密码</button>
            </div>
        </div>
    </div>
</div>
</body>
</html>
